$(function() {
    $.ajax({
        url: "/cart/getgoods",
        headers: {
            token: localStorage.token
        }
    }).done(function(res) {
        console.log(res);
        var item = res.data
        console.log(item);
        console.log(item[2].img);
        // console.log(item[0].img);
        let strHtml = `
        <div class="product-spots J-One-Line" style="overflow: hidden;">
            <div class="post card grid-item J-Grid-Item">
                <div class="card-wrapper">
                    <a title="" class="card-link J-Card-Link" href="./details.html?id=${item[0].id}">
                        <div class="card-cover J-Card-Cover">
                            <div class="card-cover-wrapper J-Card-Cover-Wrapper" style="background-image: url(${item[0].img});"></div>
                        </div>
                        <div class="card-desc J-Card-Desc">
                            <h2><span>${item[0].name}</span><img src="../images/mobile-arrow.png"></h2>
                            <p>${item[0].desc}</p>
                        </div>
                    </a>
                </div>
            </div>
            <div class="post card grid-item grid-item--width2 grid-item-xs-width4 J-Grid-Item sdw-pc">
                <div class="card-wrapper">
                    <a title="" class="card-link J-Card-Link" href="./details.html?id=${item[1].id}">
                        <div class="card-cover J-Card-Cover" style="padding-top: 45%;">
                            <div class="card-cover-wrapper J-Card-Cover-Wrapper" style="background-image: url(${item[1].img});"></div>
                        </div>
                        <div class="card-desc J-Card-Desc">
                            <h2><span>${item[1].name}</span><img src="../images/mobile-arrow.png"></h2>
                            <p>${item[0].desc}</p>
                        </div>
                    </a>
                </div>
            </div>
            <div class="post card grid-item J-Grid-Item">
                <div class="card-wrapper">
                    <a title="" class="card-link J-Card-Link" href="./details.html?id=${item[2].id}">
                        <div class="card-cover J-Card-Cover">
                            <div class="card-cover-wrapper J-Card-Cover-Wrapper" style="background-image: url(${item[2].img});"></div>
                        </div>
                        <div class="card-desc J-Card-Desc">
                            <h2><span>${item[2].name}</span><img src="../images/mobile-arrow.png"></h2>
                            <p>${item[2].desc}</p>
                        </div>
                    </a>
                </div>
            </div>
        </div> `

        $(".sub-banner").html(strHtml)
    })
})